<template>
	<!-- 头部标签 -->
	<view class="header-container">
		<view class="header-box" :style="{ paddingTop: top + 'px', height: height + 'px' }">
			<view class="header-logo">栖木社</view>
			<view class="search-box">
				<image style="width: 36rpx" src="/static/images/find/search.png" mode="widthFix"></image>
				<input type="text" disabled="false" placeholder="搜索" @click="toSearch" />
			</view>
		</view>
		<scroll-view scroll-x="true" style="flex-wrap: nowrap">
			<view class="tabs-container">
				<view class="tabs-item" v-for="(item, index) in fenleiTabs" :style="{ color: index == currentTab ? '#212121' : '#999' }" @tap="changeTab(index)">
					{{ item.Value }}
				</view>
			</view>
		</scroll-view>
	</view>
	<view class="container">
		<!-- 推荐 -->
		<view class="tuijian-container" :style="{ marginTop: height + 66 + 'px' }" v-if="fenleiTabs[currentTab].Data && fenleiTabs[currentTab].Data.length">
			<view class="biji-container">
				<view v-for="(item, index) in fenleiTabs[currentTab].Data" :key="index">
					<view class="biji-box" v-if="index % 2 == 0" @tap="toWenZhangDetail(item)">
						<image
							v-if="item.TupianMS && JSON.parse(item.TupianMS).length"
							class="biji-image"
							style="max-height: 500rpx"
							:src="Microi.FileServer + JSON.parse(item.TupianMS)[0].Path"
							mode="aspectFill"
						></image>
						<view v-if="item.Shipin" style="position: relative">
							<view class="play-btn">
								<tui-icon name="turningright" color="#fff" size="20"></tui-icon>
							</view>
							<image v-if="item.Fengmian" :src="Microi.FileServer + item.Fengmian" mode="aspectFill" class="biji-image" style="max-height: 500rpx"></image>
							<video
								:controls="false"
								:show-center-play-btn="false"
								class="biji-image"
								v-else
								:src="item.Shipin"
								:object-fit="'cover'"
								:enable-progress-gesture="false"
								:show-fullscreen-btn="false"
								:show-play-btn="false"
								:enable-play-gesture="false"
							></video>
						</view>

						<view class="no-img-box" v-else>
							<!-- <image src="/static/images/find/douhao.png" mode="widthFix" class="douhao-img"></image> -->
							<view class="no-img-nr">
								{{ item.neirong }}
							</view>
							<view class="bottom-bgc"></view>
						</view>
						<view class="biji-info">
							<view class="biji-biaoti">{{ item.neirong }}</view>
							<view class="biji-line">
								<view class="left-box">
									<image :src="item.Avatar" mode="aspectFill"></image>
									<view class="biji-name">{{ item.NAME }}</view>
								</view>
								<view class="right-box" @tap.stop="DianzanSC(item, index)">
									<image v-if="item.myZan" src="/static/images/company/hongxin.png" mode="widthFix"></image>
									<image v-else src="/static/images/company/xin.png" mode="widthFix"></image>
									<view class="biji-name" :style="{ color: item.myZan ? '#FA1B0A' : '#666666' }">{{ computeNum(item.DianzanL * 1) }}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="biji-container">
				<view v-for="(item, index) in fenleiTabs[currentTab].Data" :key="index">
					<view class="biji-box" v-if="index % 2 != 0" @tap="toWenZhangDetail(item)">
						<image
							v-if="item.TupianMS && JSON.parse(item.TupianMS).length"
							class="biji-image"
							style="max-height: 500rpx"
							:src="Microi.FileServer + JSON.parse(item.TupianMS)[0].Path"
							mode="aspectFill"
						></image>
						<view v-else-if="item.Shipin" style="position: relative">
							<view class="play-btn">
								<tui-icon name="turningright" color="#fff" size="20"></tui-icon>
							</view>
							<image v-if="item.Fengmian" :src="Microi.FileServer + item.Fengmian" mode="aspectFill" class="biji-image" style="max-height: 500rpx"></image>
							<video
								:controls="false"
								:show-center-play-btn="false"
								class="biji-image"
								v-else
								:src="item.Shipin"
								:object-fit="'cover'"
								:enable-progress-gesture="false"
								:show-fullscreen-btn="false"
								:show-play-btn="false"
								:enable-play-gesture="false"
							></video>
						</view>

						<view class="no-img-box" v-else>
							<image src="/static/images/find/douhao.png" mode="widthFix" class="douhao-img"></image>
							<view class="no-img-nr">
								{{ item.neirong }}
							</view>
							<view class="bottom-bgc"></view>
						</view>
						<view class="biji-info">
							<view class="biji-biaoti">{{ item.neirong }}</view>
							<view class="biji-line">
								<view class="left-box">
									<image :src="item.Avatar" mode="aspectFill"></image>
									<view class="biji-name">{{ item.NAME }}</view>
								</view>
								<view class="right-box" @tap.stop="DianzanSC(item, index)">
									<image v-if="item.myZan" src="/static/images/company/hongxin.png" mode="widthFix"></image>
									<image v-else src="/static/images/company/xin.png" mode="widthFix"></image>
									<view class="biji-name" :style="{ color: item.myZan ? '#FA1B0A' : '#666666' }">{{ computeNum(item.DianzanL * 1) }}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view v-else class="no-Data" :style="{ marginTop: height + 66 + 'px' }">
			<image src="/static/images/my/noData.png" mode="widthFix"></image>
			<view class="">暂无文章</view>
		</view>
	</view>

	<!-- 左边弹窗 -->
	<tui-drawer mode="left" zIndex="1000" :visible="leftPopup" @close="closePopup">
		<view class="popup-info" :style="{ paddingTop: top + 'px' }">
			<image src="/static/images/find/xiala.png" class="popup-logo" @tap="closePopup"></image>
			<view class="popup-box" @tap="toFeedBack">
				<image src="/static/images/my/edit-pane.png" mode=""></image>
				<view>意见反馈</view>
			</view>
			<view class="popup-box" @tap="changeAccount">
				<image src="/static/images/my/change.png" mode=""></image>
				<view>切换账号</view>
			</view>
			<view class="popup-box" @tap="loginOut" v-if="Islogin">
				<image src="/static/images/my/back.png" mode=""></image>
				<view>退出登录</view>
			</view>
		</view>
	</tui-drawer>
	<!-- 导航栏 -->
	<tabbar currentTab="0" />
</template>

<script>
import tabbar from '/model/tabbar.vue';
import { getLocation } from '@/utils/location';
import { TUILogin } from '@tencentcloud/tui-core';
export default {
	components: {
		tabbar
	},

	data() {
		return {
			startTime: 0,
			Islogin: this.Microi.IsLogin(),
			CurrentUser: this.Microi.GetCurrentUser(),
			leftPopup: false,
			winInfo: {},
			share: {},
			height: 64, //header高度
			top: 26, //标题图标距离顶部距离
			locationData: {}, // 位置信息
			scrollH: 0, //滚动总高度
			currentTab: 0,
			width: 375,
			page: 0,
			Data: [],
			noData: false,
			fenleiTabs: [
				{
					Value: '推荐'
				}
			]
			// BeijingT: '',
			// tabs: [
			// 	{
			// 		name: '推荐',
			// 		page: 1,
			// 		Data: [],
			// 		noData: false
			// 	},
			// 	{
			// 		name: '人脉',
			// 		page: 1,
			// 		Data: [],
			// 		noData: false
			// 	}
			// ]
		};
	},
	mounted() {
		let obj = {};
		// #ifdef MP-WEIXIN
		obj = wx.getMenuButtonBoundingClientRect();
		// #endif
		// #ifdef MP-BAIDU
		obj = swan.getMenuButtonBoundingClientRect();
		// #endif
		// #ifdef MP-ALIPAY
		my.hideAddToDesktopMenu();
		// #endif

		setTimeout(() => {
			uni.getSystemInfo({
				success: (res) => {
					this.width = obj.left || res.windowWidth;
					this.tabwidth = this.width * 0.45;
					this.height = obj.top ? obj.top + obj.height + 8 : res.statusBarHeight + 44;

					this.top = obj.top ? obj.top + (obj.height - 32) / 2 : res.statusBarHeight + 6;
					this.winInfo = res;
					// if (res.hostName == 'WeChat') {
					// 	this.top = this.top + 30;
					// }
					this.scrollH = res.windowWidth;
					if (res.hostName != 'WeChat') {
						uni.hideTabBar();
					}
				}
			});
		}, 0);
	},
	onLoad(options) {
		if (options.ShangjiID) {
			uni.setStorageSync('ShangjiID', options.ShangjiID);
		}
		this.getshare();
		this.options = options;
		// if (this.Islogin) {
		// 	this.getLocationData();
		// 	// this.Imlogin();
		// }
		// this.get_morenBGC();
		this.getBijiFenlei();
		this.getWenzhangList();
	},
	onShow() {
		this.startTime = new Date();
	},
	onHide() {
		if (this.Islogin) {
			// 获取当前页面栈
			const pages = getCurrentPages();
			// 获取当前页面的对象
			const currentPage = pages[pages.length - 1];
			// 获取当前页面的路径
			const route = currentPage.route;
			// 获取当前页面的参数
			const options = currentPage.options;
			this.Microi.ApiEngine.Run('Add_liulanLog', {
				YemianCS: options,
				YemianDZ: route,
				LiulanSJC: new Date().getTime() - this.startTime.getTime()
			});
		}
	},
	onUnload() {
		if (this.Islogin) {
			// 获取当前页面栈
			const pages = getCurrentPages();
			// 获取当前页面的对象
			const currentPage = pages[pages.length - 1];
			// 获取当前页面的路径
			const route = currentPage.route;
			// 获取当前页面的参数
			const options = currentPage.options;
			this.Microi.ApiEngine.Run('Add_liulanLog', {
				YemianCS: options,
				YemianDZ: route,
				LiulanSJC: new Date().getTime() - this.startTime.getTime()
			});
		}
	},
	methods: {
		toFeedBack() {
			// uni.navigateTo({
			// 	url: '/pages/my/feedBack/feedBack'
			// });
			this.Microi.RouterPush('/pages/my/feedBack/feedBack', true);
		},
		async getBijiFenlei() {
			var self = this;
			var res = await self.Microi.ApiEngine.Run('customize_crud', {
				EngineKey: 'KEY000011'
			});
			this.fenleiTabs.push(...res.Data);
		},
		toSearch() {
			uni.navigateTo({
				url: '/pages/my/search/search'
			});
		},
		changeAccount() {
			this.Microi.RouterPush('/pages/my/changeUser/changeUser', true);
		},
		async getshare() {
			this.share = await this.Microi.ApiEngine.Run('share_picture', {
				Type: 1
			});
		},
		async getWenzhangList() {
			var self = this;
			var info = self.fenleiTabs[this.currentTab];
			var page = info.page || 1;
			var res = await self.Microi.ApiEngine.Run('get_TuiJian_Wenzhang', {
				page: page,
				YonghuID: self.CurrentUser?.Id,
				searchFL: self.currentTab > 0 ? self.fenleiTabs[self.currentTab].Value : ''
			});
			if (page) {
				info.Data = res.Data;
				console.log('info.Data',info.Data);
			} else {
				info.Data.push(...res.Data);
			}
			if (!res.Data.length) {
				info.noData = true;
				return;
			}
			info.page = page++;
		},
		loginOut() {
			this.Microi.Logout();
			this.closePopup();
		},
		toWenZhangDetail(item) {
			if (item.Shipin) {
				uni.navigateTo({
					url: '/pages/my/Biji/shipin?Id=' + item.WenzhangID
				});
			} else {
				uni.navigateTo({
					url: '/pages/my/Biji/tuwen?Id=' + item.WenzhangID
				});
			}
		},
		// 获取位置
		async getLocationData() {
			var self = this;
			this.locationData = await getLocation();
			if (self.Islogin && self.CurrentUser.IPsd != JSON.stringify([this.locationData.province, this.locationData.city, this.locationData.district])) {
				self.Microi.FormEngine.UptFormData({
					FormEngineKey: 'sys_user',
					Id: self.CurrentUser.Id,
					_RowModel: {
						IPsd: JSON.stringify([this.locationData.province, this.locationData.city, this.locationData.district])
					}
				});
				self.CurrentUser.IPsd = JSON.stringify([this.locationData.province, this.locationData.city, this.locationData.district]);
				self.Microi.SetCurrentUser(self.CurrentUser);
			}
		},
		async get_morenBGC() {
			var self = this;
			var res = await self.Microi.ApiEngine.Run('customize_crud', {
				EngineKey: 'KEY000007'
			});
			this.BeijingT = this.Microi.FileServer + res.Data;
		},
		async DianzanSC(item, index) {
			if (!this.Islogin) {
				this.Microi.Tips('请先完成登录~', false);
				return;
			}
			var self = this;
			var info = self.tabs[self.currentTab].Data[index];
			uni.showLoading({
				title: '加载中～',
				mask: true
			});
			var res = await self.Microi.ApiEngine.Run('user_dianzanOrsc', {
				Id: item.WenzhangID,
				Caozuo: '点赞',
				Leixing: item.Leixing,
				ZuozheID: item.YonghuID,
				Type: item.myZan
			});
			info.myZan = item.myZan ? 0 : 1;
			info.DianzanL = item.myZan ? info.DianzanL + 1 : info.DianzanL - 1;
			uni.hideLoading();
		},
		async Imlogin() {
			var UserSig = await this.Microi.ApiEngine.Run('get_Im_UserId', {
				Account: this.CurrentUser.Account
			});
			UserSig = UserSig.Data;
			TUILogin.login({
				SDKAppID: 1600084585,
				userID: this.CurrentUser.Account,
				userSig: UserSig,
				useUploadPlugin: true,
				useProfanityFilterPlugin: false,
				framework: `vue2` // 当前开发使用框架 vue2 / vue3
			}).then(() => {
				// const conversationID = options.conversationID;
				// TUIConversationService.switchConversation(conversationID);
			});
		},

		computeNum(num) {
			num = num * 1;
			if (num > 10000) {
				return num / 10000 + 'w+';
			} else if (num > 1000) {
				return num / 1000 + 'k+';
			} else {
				return num;
			}
		},
		async getUserList() {
			var self = this;
			var res = await self.Microi.ApiEngine.Run('get_RenmaiInfo', {
				page: self.tabs[1].page || 1,
				YonghuID: self.CurrentUser?.Id
			});
			if (!res.Data.length) {
				this.tabs[1].noData = true;
				return;
			}
			this.tabs[1].Data.push(...res.Data);
			this.tabs[1].page++;
		},
		changeTab(index) {
			this.currentTab = index;
			if (!this.fenleiTabs[index].Data) {
				this.getWenzhangList();
			}
		},
		search() {
			uni.navigateTo({
				url: '/pages/my/search/search?currentTab=' + this.currentTab
			});
		},
		toUserDetail(Id) {
			uni.navigateTo({
				url: '/pages/my/myDetail/myDetail?Id=' + Id
			});
		},
		openPopup() {
			this.leftPopup = true;
		},
		closePopup() {
			this.leftPopup = false;
		}
	},
	/**
	 * 用户点击右上角分享
	 */
	onShareAppMessage: function (options) {
		var path = this.share.Lianjie;
		if (this.Islogin) {
			path = path + '?ShangjiID=' + this.CurrentUser.Id;
		}
		return {
			title: this.share.Biaoti,
			path: path,
			imageUrl: this.share.Tupian,
			success: function (res) {}
		};
	},
	onShareTimeline: function () {
		return {
			title: this.share.Biaoti,
			query: {
				ShangjiID: this.CurrentUser.Id
			},
			imageUrl: this.share.Tupian
		};
	},
	onReachBottom() {
		if (this.noData) {
			this.Microi.Tips('到底了～', false);
			return;
		} else {
			this.getWenzhangList();
		}
	},
	onPullDownRefresh() {
		this.page = 1;
		this.Data = [];
		this.noData = false;
		this.getWenzhangList();
		setTimeout(function () {
			uni.stopPullDownRefresh();
		}, 500);
	}
};
</script>

<style>
page {
	background-color: #f5f5f5;
}
.container {
	background-color: #f5f5f5;
	padding: 0 0 150rpx 0;
	position: relative;
	z-index: 1;
}
/* page {
	background-color: #f5f5f5;
	padding: 0 0 150rpx 0;
	position: relative;
	z-index: 1;
} */
.header-container {
	box-sizing: border-box;
	background-color: #ffffff;
	position: fixed;
	z-index: 999;
	width: 100%;
	top: 0;
	left: 0;
}
.header-box {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	background-color: #ffffff;
	box-sizing: border-box;
	padding: 20rpx;
	border: 2rpx solid #f4f5f6;
	gap: 28rpx;
}
.header-logo {
	padding: 12rpx 14rpx;
	box-sizing: border-box;
	background-color: #fb353b;
	border-radius: 30rpx 0 30rpx 0;

	font-family: PingFang SC, PingFang SC;
	font-weight: 600;
	font-size: 30rpx;
	color: #fff;
	text-align: center;
	font-style: italic;
	text-transform: none;
	white-space: nowrap;
}
.search-box {
	width: 360rpx;
	height: 64rpx;
	background: #f4f4f4;
	border-radius: 130rpx 130rpx 130rpx 130rpx;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 14rpx 26rpx;
	box-sizing: border-box;
	gap: 18rpx;
}
.tabs-container {
	padding: 16rpx;
	background-color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	height: 66rpx;
	gap: 60rpx;
}
.tabs-item {
	height: 42rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: 500;
	font-size: 30rpx;
	color: #999999;
	text-align: center;
	font-style: normal;
	text-transform: none;
	white-space: nowrap;
}
/* 优化RenMai-container的样式 */
.RenMai-container {
	display: flex;
	flex-direction: column;
	align-items: center; /* 确保内容居中对齐 */
	margin-top: 16rpx;
	flex: 1; /* 使用flex: 1来平均分配空间 */
	padding: 0 10rpx; /* 添加一些内边距以避免内容溢出 */
}
.RenMai-box {
	width: 100%;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: column;
	padding: 16rpx;
	padding-top: 70rpx;
	border-radius: 16rpx;
	overflow: hidden;
	background-color: #fff;
	box-sizing: border-box;
	margin-bottom: 16rpx;
}

.Renmai-BGC {
	position: absolute;
	top: 0%;
	left: 0;
	width: 100%;
	height: 160rpx;

	border-radius: 0 0 50% 50%;
}
.Renmai-avatar {
	width: 117rpx;
	height: 116rpx;
	z-index: 1;
	border-radius: 16rpx 16rpx 16rpx 16rpx;
}
.RenMai-name {
	font-family: PingFang SC, PingFang SC;
	font-weight: 800;
	font-size: 32rpx;
	color: #212121;
	text-align: center;
	font-style: normal;
	text-transform: none;
	margin-top: 25rpx;
}
.Renmai-Zhiwei {
	margin: 20rpx 0;
	font-family: PingFang SC, PingFang SC;
	/* font-weight: 500; */
	font-size: 24rpx;
	color: #333333;
	text-align: center;
	font-style: normal;
	text-transform: none;
}
.pinglun-nr {
	width: 282rpx;
	font-family: PingFang SC, PingFang SC;
	font-size: 24rpx;
	color: #999999;
	text-align: center;
	font-style: normal;
	text-transform: none;

	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
}
.popup-info {
	height: 100vh;
	padding: 32rpx;
	width: 520rpx;
	box-sizing: border-box;
	background: #eef0f1;
	z-index: 1000;
	border-radius: 78rpx 0rpx 0rpx 78rpx;
}

.popup-logo {
	width: 40rpx;
	height: 40rpx;
}
.popup-box {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	background-color: #fff;
	margin-bottom: 20rpx;
	box-sizing: border-box;
	width: 456rpx;
	height: 88rpx;
	padding: 20rpx;
	background: #ffffff;
	border-radius: 16rpx 16rpx 16rpx 16rpx;
	border: 1rpx solid #f3f5f9;

	font-weight: 500;
	font-size: 28rpx;
	color: #333333;
	line-height: 33rpx;
	text-align: left;
	font-style: normal;
	text-transform: none;
}
.popup-box image {
	width: 36rpx;
	height: 36rpx;
	margin-right: 14rpx;
}
.tuijian-container {
	display: flex;
	justify-content: flex-start;
	padding: 12rpx 20rpx;
	box-sizing: border-box;
	gap: 12rpx;
}
.biji-container {
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
}
.biji-box {
	background-color: #fff;
	width: 46vw;
	background: #ffffff;
	border-radius: 16rpx;
	overflow: hidden;
	margin-bottom: 10rpx;
	position: relative;
}
.wz-title {
	position: absolute;
	top: 22rpx;
	right: 22rpx;
	padding: 0 12rpx;
	box-sizing: border-box;

	height: 40rpx;
	background: #eef0f1;
	border-radius: 8rpx 8rpx 8rpx 8rpx;

	font-family: PingFang SC, PingFang SC;
	line-height: 40rpx;
	font-size: 24rpx;
	color: #999999;
	text-align: center;
	font-style: normal;
	text-transform: none;
}
.play-btn {
	position: absolute;
	top: 22rpx;
	right: 22rpx;
	width: 30rpx;
	height: 30rpx;
	border-radius: 50%;
	z-index: 990;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0, 0, 0, 0.1);
}
.LiuLanL-box {
	position: absolute;
	left: 3%;
	top: 1%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 2rpx;

	font-family: Roboto, Roboto;
	font-size: 28rpx;
	color: #ffffff;
	text-align: left;
	font-style: normal;
	text-transform: none;
	padding: 2rpx 10rpx;
	border-radius: 30rpx;
	background-color: rgba(0, 0, 0, 0.1);
}
.LiuLanL-box image {
	width: 32rpx;
	height: 32rpx;
}
.biji-image {
	width: 100%;
	background-color: #fff;
	height: 352rpx;
	object-fit: cover;
}
.video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.no-img-box {
	width: 352rpx;
	height: 352rpx;
	background: #ede7fb;
	position: relative;

	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 20rpx;
	box-sizing: border-box;
}
.bottom-bgc {
	position: absolute;
	bottom: 5%;
	right: 5%;

	width: 50rpx;
	height: 20rpx;
	background-color: #dac8e9;
}
.no-img-nr {
	width: 100%;
	height: 80rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: 500;
	font-size: 28rpx;
	color: #333333;
	text-align: center;
	font-style: normal;
	text-transform: none;

	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
}
.douhao-img {
	position: absolute;
	top: 5%;
	left: 5%;
	width: 50rpx;
}
.biji-info {
	width: 100%;
	/* height: 122rpx; */
	background: #ffffff;
	border-radius: 0rpx 0rpx 16rpx 16rpx;
	padding: 18rpx 16rpx;
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	gap: 18rpx;
	box-sizing: border-box;
}
.biji-biaoti {
	font-family: Roboto, Roboto;
	font-weight: 400;
	font-size: 28rpx;
	color: #333333;
	text-align: left;
	font-style: normal;
	text-transform: none;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
}
.biji-line {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.left-box {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 12rpx;
}
.left-box image {
	width: 36rpx;
	height: 36rpx;
	border-radius: 50%;
}
.biji-name {
	font-family: PingFang SC, PingFang SC;
	font-size: 24rpx;
	color: #666666;
	text-align: left;
	font-style: normal;
	text-transform: none;
}
.right-box {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 8rpx;

	font-family: Inter, Inter;
	font-weight: 400;
	font-size: 24rpx;
	color: #ea3325;
	text-align: left;
	font-style: normal;
	text-transform: none;
}
.right-box image {
	width: 36rpx;
	height: 30rpx;
}
video {
	z-index: -1;
}
.no-Data {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 10rpx;

	font-family: PingFang SC, PingFang SC;
	font-size: 24rpx;
	color: #666666;
	text-align: left;
	font-style: normal;
	text-transform: none;
}
</style>
